import React, { useState, useRef, useEffect } from 'react';
import { View, ScrollView, Text, StyleSheet } from 'react-native';
import { Tester, TestCase, TestSuite } from '@rnoh/testerino';
import { ExpandableCalendar, CalendarProvider } from 'react-native-calendars';
const CalendarWithOpenThreshold = () => {
  const openThreshold = 50
  const [isExpanded, setIsExpanded] = useState(false);

  return (
    <Tester>
      <TestSuite name='openThreshold'>
        <CalendarProvider date={'2012-5-8'}>
          <ExpandableCalendar
            openThreshold={openThreshold}
            onCalendarToggled={(calendarOpened: boolean) => {
              console.log('Calendar toggled:', calendarOpened);
              setIsExpanded(calendarOpened);
            }}
          />
        </CalendarProvider>
        {isExpanded && (
          <View style={{ backgroundColor: '#e0e0e0', padding: 20, marginTop: 330 }}>
            <Text>这是展开的额外信息</Text>
            {/* 这里可以放置更多日历相关的详细信息 */}
          </View>
        )}
      </TestSuite>
    </Tester>

  );
};

const styles = StyleSheet.create({
  // 可以在这里添加样式，但本例中未使用额外样式  
});

export default CalendarWithOpenThreshold;